<!DOCTYPE html>
<html lang="en">
  	<head>
	    <meta charset="utf-8">
	    <title>Simplify Admin</title>
	    <meta name="viewport" content="width=device-width, initial-scale=1.0">
	    <meta name="description" content="">
	    <meta name="author" content="">

	    <!-- Bootstrap core CSS -->
	    <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
		
		<!-- Font Awesome -->
		<link href="css/font-awesome.min.css" rel="stylesheet">

		<!-- ionicons -->
		<link href="css/ionicons.min.css" rel="stylesheet">
		
		<!-- Simplify -->
		<link href="css/simplify.min.css" rel="stylesheet">

  	</head>

  	<body class="overflow-hidden">
		<div class="wrapper preload">
			<div class="sidebar-right">
				<div class="sidebar-inner scrollable-sidebar">
					<div class="sidebar-header clearfix">
						<input class="form-control dark-input" placeholder="Search" type="text">
						<div class="btn-group pull-right">
							<a href="#" class="sidebar-setting" data-toggle="dropdown"><i class="fa fa-cog fa-lg"></i></a>
							<ul class="dropdown-menu pull-right flipInV">
								<li><a href="#"><i class="fa fa-circle text-danger"></i><span class="m-left-xs">Busy</span></a></li>
								<li><a href="#"><i class="fa fa-circle-o"></i><span class="m-left-xs">Turn Off Chat</span></a></li>
							</ul>
						</div>
					</div>
					<div class="title-block">
						Group Chat
					</div>
					<div class="content-block">
						<ul class="sidebar-list">
							<li>
								<a href="#">
									<i class="fa fa-circle-o text-success"></i><span class="m-left-xs">Close Friends</span>
								</a>
							</li>
							<li>
								<a href="#">
									<i class="fa fa-circle-o text-success"></i><span class="m-left-xs">Business</span>
								</a>
							</li>
						</ul>
					</div>
					<div class="title-block">
						Favorites
					</div>
					<div class="content-block">
						<ul class="sidebar-list">
							<li>
								<a href="#" class="clearfix">
									<img src="images/profile/profile2.jpg" class="img-circle" alt="user avatar">
									<div class="chat-detail m-left-sm">
										<div class="chat-name">
											John Doe
										</div>
										<div class="chat-message">
											Where are you?
										</div>
									</div>
									<div class="chat-status">
										<i class="fa fa-circle-o text-success"></i>
									</div>
									<div class="chat-alert">
										<span class="badge badge-purple bounceIn animation-delay2">2</span>
									</div>
								</a>
							</li>
							<li>
								<a href="#" class="clearfix">
									<img src="images/profile/profile3.jpg" class="img-circle" alt="user avatar">
									<div class="chat-detail m-left-sm">
										<div class="chat-name">
											Jane Doe
										</div>
										<div class="chat-message">
											Hello
										</div>
									</div>
									<div class="chat-status">
										<i class="fa fa-circle-o text-success"></i>
									</div>
									<div class="chat-alert">
										<span class="badge badge-info bounceIn animation-delay2">1</span>
									</div>
								</a>
							</li>
							<li>
								<a href="#" class="clearfix">
									<img src="images/profile/profile4.jpg" class="img-circle" alt="user avatar">
									<div class="chat-detail m-left-sm">
										<div class="chat-name">
											John Doe
										</div>
										<div class="chat-message">
											See you again next week.
										</div>
									</div>
									<div class="chat-status">
										<i class="fa fa-circle-o text-danger"></i>
									</div>
									<div class="chat-alert">
										<i class="fa fa-check text-success"></i>
									</div>
								</a>
							</li>
							<li>
								<a href="#" class="clearfix">
									<img src="images/profile/profile5.jpg" class="img-circle" alt="user avatar">
									<div class="chat-detail m-left-sm">
										<div class="chat-name">
											John Doe
										</div>
										<div class="chat-message">
											Hello, Are you there?
										</div>
									</div>
									<div class="chat-status">
										<i class="fa fa-circle-o text-danger"></i>
									</div>
									<div class="chat-alert">
										<i class="fa fa-reply"></i>
									</div>
								</a>
							</li>
						</ul>
					</div>
					<div class="title-block">
						More friends
					</div>
					<div class="content-block">
						<ul class="sidebar-list">
							<li>
								<a href="#" class="clearfix">
									<img src="images/profile/profile6.jpg" class="img-circle" alt="user avatar">
									<div class="chat-detail m-left-sm">
										<div class="chat-name">
											John Doe
										</div>
										<div class="chat-message">
											Where are you?
										</div>
									</div>
									<div class="chat-status">
										<i class="fa fa-circle-o text-success"></i>
									</div>
									<div class="chat-alert">
										<span class="badge badge-success bounceIn animation-delay2">2</span>
									</div>
								</a>
							</li>
							<li>
								<a href="#" class="clearfix">
									<img src="images/profile/profile7.jpg" class="img-circle" alt="user avatar">
									<div class="chat-detail m-left-sm">
										<div class="chat-name">
											Jane Doe
										</div>
										<div class="chat-message">
											Hello
										</div>
									</div>
									<div class="chat-status">
										<i class="fa fa-circle-o text-success"></i>
									</div>
									<div class="chat-alert">
										<span class="badge badge-danger bounceIn animation-delay2">1</span>
									</div>
								</a>
							</li>
							<li>
								<a href="#" class="clearfix">
									<img src="images/profile/profile8.jpg" class="img-circle" alt="user avatar">
									<div class="chat-detail m-left-sm">
										<div class="chat-name">
											John Doe
										</div>
										<div class="chat-message">
											See you again next week.
										</div>
									</div>
									<div class="chat-status">
										<i class="fa fa-circle-o text-danger"></i>
									</div>
									<div class="chat-alert">
										<i class="fa fa-check text-success"></i>
									</div>
								</a>
							</li>
							<li>
								<a href="#" class="clearfix">
									<img src="images/profile/profile9.jpg" class="img-circle" alt="user avatar">
									<div class="chat-detail m-left-sm">
										<div class="chat-name">
											John Doe
										</div>
										<div class="chat-message">
											Hello, Are you there?
										</div>
									</div>
									<div class="chat-status">
										<i class="fa fa-circle-o text-danger"></i>
									</div>
									<div class="chat-alert">
										<i class="fa fa-reply"></i>
									</div>
								</a>
							</li>
						</ul>
					</div>
				</div><!-- sidebar-inner -->
			</div><!-- sidebar-right -->
			<header class="top-nav">
				<div class="top-nav-inner">
					<div class="nav-header">
						<button type="button" class="navbar-toggle pull-left sidebar-toggle" id="sidebarToggleSM">
							<span class="icon-bar"></span>
							<span class="icon-bar"></span>
							<span class="icon-bar"></span>
						</button>
						
						<ul class="nav-notification pull-right">
							<li>
								<a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-cog fa-lg"></i></a>
								<span class="badge badge-danger bounceIn">1</span>
								<ul class="dropdown-menu dropdown-sm pull-right">
									<li class="user-avatar">
										<img src="images/profile/profile1.jpg" alt="" class="img-circle">
										<div class="user-content">
											<h5 class="no-m-bottom">John Doe</h5>
											<div class="m-top-xs">
												<a href="profile.html" class="m-right-sm">Profile</a>
												<a href="signin.html">Log out</a>
											</div>
										</div>
									</li>	  
									<li>
										<a href="inbox.html">
											Inbox
											<span class="badge badge-danger bounceIn animation-delay2 pull-right">1</span>
										</a>
									</li>			  
									<li>
										<a href="#">
											Notification
											<span class="badge badge-purple bounceIn animation-delay3 pull-right">2</span>
										</a>
									</li>			  
									<li>
										<a href="#" class="sidebarRight-toggle">
											Message
											<span class="badge badge-success bounceIn animation-delay4 pull-right">7</span>
										</a>
									</li>			  	  
									<li class="divider"></li>
									<li>
										<a href="#">Setting</a>
									</li>			  	  
								</ul>
							</li>
						</ul>
						
						<a href="index.html" class="brand">
							<i class="fa fa-database"></i><span class="brand-name">SIMPLIFY ADMIN</span>
						</a>
					</div>
					<div class="nav-container">
						<button type="button" class="navbar-toggle pull-left sidebar-toggle" id="sidebarToggleLG">
							<span class="icon-bar"></span>
							<span class="icon-bar"></span>
							<span class="icon-bar"></span>
						</button>
						<ul class="nav-notification">	
							<li class="search-list">
								<div class="search-input-wrapper">
									<div class="search-input">
										<input type="text" class="form-control input-sm inline-block">
										<a href="#" class="input-icon text-normal"><i class="ion-ios7-search-strong"></i></a>
									</div>
								</div>
							</li>
						</ul>
						<div class="pull-right m-right-sm">
							<div class="user-block hidden-xs">
								<a href="#" id="userToggle" data-toggle="dropdown">
									<img src="images/profile/profile1.jpg" alt="" class="img-circle inline-block user-profile-pic">
									<div class="user-detail inline-block">
										Jane Doe
										<i class="fa fa-angle-down"></i>
									</div>
								</a>
								<div class="panel border dropdown-menu user-panel">
									<div class="panel-body paddingTB-sm">
										<ul>
											<li>
												<a href="profile.html">
													<i class="fa fa-edit fa-lg"></i><span class="m-left-xs">My Profile</span>
												</a>
											</li>
											<li>
												<a href="inbox.html">
													<i class="fa fa-inbox fa-lg"></i><span class="m-left-xs">Inboxes</span>
													<span class="badge badge-danger bounceIn animation-delay3">2</span>
												</a>
											</li>
											<li>
												<a href="signin.html">
													<i class="fa fa-power-off fa-lg"></i><span class="m-left-xs">Sign out</span>
												</a>
											</li>
										</ul>
									</div>
								</div>
							</div>
							<ul class="nav-notification">
								<li>
									<a href="#" data-toggle="dropdown"><i class="fa fa-envelope fa-lg"></i></a>
									<span class="badge badge-purple bounceIn animation-delay5 active">2</span>
									<ul class="dropdown-menu message pull-right">
										<li><a>You have 4 new unread messages</a></li>					  
										<li>
											<a class="clearfix" href="#">
												<img src="images/profile/profile2.jpg" alt="User Avatar">
												<div class="detail">
													<strong>John Doe</strong>
													<p class="no-margin">
														Lorem ipsum dolor sit amet...
													</p>
													<small class="text-muted"><i class="fa fa-check text-success"></i> 27m ago</small>
												</div>
											</a>	
										</li>
										<li>
											<a class="clearfix" href="#">
												<img src="images/profile/profile3.jpg" alt="User Avatar">
												<div class="detail">
													<strong>Jane Doe</strong>
													<p class="no-margin">
														Lorem ipsum dolor sit amet...
													</p>
													<small class="text-muted"><i class="fa fa-check text-success"></i> 5hr ago</small>
												</div>
											</a>	
										</li>
										<li>
											<a class="clearfix" href="#">
												<img src="images/profile/profile4.jpg" alt="User Avatar">
												<div class="detail m-left-sm">
													<strong>Bill Doe</strong>
													<p class="no-margin">
														Lorem ipsum dolor sit amet...
													</p>
													<small class="text-muted"><i class="fa fa-reply"></i> Yesterday</small>
												</div>
											</a>	
										</li>
										<li>
											<a class="clearfix" href="#">
												<img src="images/profile/profile5.jpg" alt="User Avatar">
												<div class="detail">
													<strong>Baby Doe</strong>
													<p class="no-margin">
														Lorem ipsum dolor sit amet...
													</p>
													<small class="text-muted"><i class="fa fa-reply"></i> 9 Feb 2013</small>
												</div>
											</a>	
										</li>
										<li><a href="#">View all messages</a></li>					  
									</ul>
								</li>
								<li>
									<a href="#" data-toggle="dropdown"><i class="fa fa-bell fa-lg"></i></a>
									<span class="badge badge-info bounceIn animation-delay6 active">4</span>
									<ul class="dropdown-menu notification dropdown-3 pull-right">
										<li><a href="#">You have 5 new notifications</a></li>					  
										<li>
											<a href="#">
												<span class="notification-icon bg-warning">
													<i class="fa fa-warning"></i>
												</span>
												<span class="m-left-xs">Server #2 not responding.</span>
												<span class="time text-muted">Just now</span>
											</a>
										</li>
										<li>
											<a href="#">
												<span class="notification-icon bg-success">
													<i class="fa fa-plus"></i>
												</span>
												<span class="m-left-xs">New user registration.</span>
												<span class="time text-muted">2m ago</span>
											</a>
										</li>
										<li>
											<a href="#">
												<span class="notification-icon bg-danger">
													<i class="fa fa-bolt"></i>
												</span>
												<span class="m-left-xs">Application error.</span>
												<span class="time text-muted">5m ago</span>
											</a>
										</li>
										<li>
											<a href="#">
												<span class="notification-icon bg-success">
													<i class="fa fa-usd"></i>
												</span>
												<span class="m-left-xs">2 items sold.</span>
												<span class="time text-muted">1hr ago</span>
											</a>
										</li>
										<li>
											<a href="#">
												<span class="notification-icon bg-success">
													<i class="fa fa-plus"></i>
												</span>
												<span class="m-left-xs">New user registration.</span>
												<span class="time text-muted">1hr ago</span>
											</a>
										</li>
										<li><a href="#">View all notifications</a></li>					  
									</ul>
								</li>
								<li class="chat-notification">
									<a href="#" class="sidebarRight-toggle"><i class="fa fa-comments fa-lg"></i></a>
									<span class="badge badge-danger bounceIn">1</span>

									<div class="chat-alert">
										Hello, Are you there?
									</div>
								</li>
							</ul>
						</div>
					</div>
				</div><!-- ./top-nav-inner -->	
			</header>
			<aside class="sidebar-menu fixed">
				<div class="sidebar-inner scrollable-sidebar">
					<div class="main-menu">
						<ul class="accordion">
							<li class="menu-header">
								Main Menu
							</li>
							<li class="bg-palette1">
								<a href="index.html">
									<span class="menu-content block">
										<span class="menu-icon"><i class="block fa fa-home fa-lg"></i></span>
										<span class="text m-left-sm">Dashboard</span>
									</span>
									<span class="menu-content-hover block">
										Home
									</span>
								</a>
							</li>
							<li class="bg-palette2">
								<a href="landing/landing.html">
									<span class="menu-content block">
										<span class="menu-icon"><i class="block fa fa-desktop fa-lg"></i></span>
										<span class="text m-left-sm">Landing</span>
									</span>
									<span class="menu-content-hover block">
										Landing
									</span>
								</a>
							</li>
							<li class="openable bg-palette3">
								<a href="#">
									<span class="menu-content block">
										<span class="menu-icon"><i class="block fa fa-list fa-lg"></i></span>
										<span class="text m-left-sm">Form Elements</span>
										<span class="submenu-icon"></span>
									</span>
									<span class="menu-content-hover block">
										Form
									</span>
								</a>
								<ul class="submenu bg-palette4">
									<li><a href="form_element.html"><span class="submenu-label">Form Element</span></a></li>
									<li><a href="form_validation.html"><span class="submenu-label">Form Validation</span></a></li>
									<li><a href="form_wizard.html"><span class="submenu-label">Form Wizard</span></a></li>
									<li><a href="dropzone.html"><span class="submenu-label">Dropzone</span></a></li>
								</ul>
							</li>
							<li class="openable bg-palette4 open">
								<a href="#">
									<span class="menu-content block">
										<span class="menu-icon"><i class="block fa fa-tags fa-lg"></i></span>
										<span class="text m-left-sm">UI Elements</span>
										<span class="submenu-icon"></span>
									</span>
									<span class="menu-content-hover block">
										UI Kits
									</span>
								</a>
								<ul class="submenu">
									<li><a href="ui_element.html"><span class="submenu-label">Basic Elements</span></a></li>
									<li class="active"><a href="button.html"><span class="submenu-label">Button & Icons</span></a></li>
									<li class="openable">
										<a href="#">
											<small class="badge badge-success badge-square bounceIn animation-delay2 m-left-xs pull-right">2</small>
											<span class="submenu-label">Tables</span>
										</a>
										<ul class="submenu third-level">
											<li><a href="static_table.html"><span class="submenu-label">Static Table</span></a></li>
											<li><a href="datatable.html"><span class="submenu-label">DataTables</span></a></li>
										</ul>
									</li>
									<li><a href="widget.html"><span class="submenu-label">Widget</span></a></li>
									<li><a href="tab.html"><span class="submenu-label">Tab</span></a></li>
									<li><a href="calendar.html"><span class="submenu-label">Calendar</span></a></li>
									<li><a href="treeview.html"><span class="submenu-label">Treeview</span></a></li>
									<li><a href="nestable_list.html"><span class="submenu-label">Nestable Lists</span></a></li>
								</ul>
							</li>
							<li class="bg-palette1">
								<a href="inbox.html">
									<span class="menu-content block">
										<span class="menu-icon"><i class="block fa fa-envelope fa-lg"></i></span>
										<span class="text m-left-sm">Inboxs</span>
										<small class="badge badge-danger badge-square bounceIn animation-delay5 m-left-xs">5</small>
									</span>
									<span class="menu-content-hover block">
										Inboxs
									</span>
								</a>
							</li>
							<li class="bg-palette2">
								<a href="timeline.html">
									<span class="menu-content block">
										<span class="menu-icon"><i class="block fa fa-clock-o fa-lg"></i></span>
										<span class="text m-left-sm">Timeline</span>
										<small class="badge badge-warning badge-square bounceIn animation-delay6 m-left-xs pull-right">7</small>
									</span>
									<span class="menu-content-hover block">
										Timeline
									</span>
								</a>
							</li>
							<li class="menu-header">
								Others
							</li>
							<li class="openable bg-palette3">
								<a href="#">
									<span class="menu-content block">
										<span class="menu-icon"><i class="block fa fa-gift fa-lg"></i></span>
										<span class="text m-left-sm">Extra Pages</span>
										<span class="submenu-icon"></span>
									</span>
									<span class="menu-content-hover block">
										Pages
									</span>
								</a>
								<ul class="submenu">
									<li><a href="signin.html"><span class="submenu-label">Sign in</span></a></li>
									<li><a href="signup.html"><span class="submenu-label">Sign Up</span></a></li>
									<li><a href="lockscreen.html"><span class="submenu-label">Lock Screen</span></a></li>
									<li><a href="profile.html"><span class="submenu-label">Profile</span></a></li>
									<li><a href="gallery.html"><span class="submenu-label">Gallery</span></a></li>
									<li><a href="blog.html"><span class="submenu-label">Blog</span></a></li>
									<li><a href="single_post.html"><span class="submenu-label">Single Post</span></a></li>
									<li><a href="pricing.html"><span class="submenu-label">Pricing</span></a></li>
									<li><a href="invoice.html"><span class="submenu-label">Invoice</span></a></li>
									<li><a href="error404.html"><span class="submenu-label">Error404</span></a></li>
									<li><a href="blank.html"><span class="submenu-label">Blank</span></a></li>
								</ul>
							</li>
							<li class="openable bg-palette4">
								<a href="#">
									<span class="menu-content block">
										<span class="menu-icon"><i class="block fa fa-list fa-lg"></i></span>
										<span class="text m-left-sm">Menu Level</span>
										<span class="submenu-icon"></span>
									</span>
									<span class="menu-content-hover block">
										Menu
									</span>
								</a>
								<ul class="submenu">
									<li class="openable">
										<a href="signin.html">
											<span class="submenu-label">menu 2.1</span>
											<small class="badge badge-success badge-square bounceIn animation-delay2 m-left-xs pull-right">3</small>
										</a>
										<ul class="submenu third-level">
											<li><a href="#"><span class="submenu-label">menu 3.1</span></a></li>
											<li><a href="#"><span class="submenu-label">menu 3.2</span></a></li>
											<li class="openable">
												<a href="#">
													<span class="submenu-label">menu 3.3</span>
													<small class="badge badge-danger badge-square bounceIn animation-delay2 m-left-xs pull-right">2</small>
												</a>
												<ul class="submenu fourth-level">
													<li><a href="#"><span class="submenu-label">menu 4.1</span></a></li>
													<li><a href="#"><span class="submenu-label">menu 4.2</span></a></li>
												</ul>
											</li>
										</ul>
									</li>
									<li><a href="#"><span class="submenu-label">menu 2.2</span></a></li>
								</ul>
							</li>
						</ul>
					</div>	
					<div class="sidebar-fix-bottom clearfix">
						<div class="user-dropdown dropup pull-left">
							<a href="#" class="dropdwon-toggle font-18" data-toggle="dropdown"><i class="ion-person-add"></i>
							</a>
							<ul class="dropdown-menu">
								<li>
									<a href="inbox.html">
										Inbox
										<span class="badge badge-danger bounceIn animation-delay2 pull-right">1</span>
									</a>
								</li>			  
								<li>
									<a href="#">
										Notification
										<span class="badge badge-purple bounceIn animation-delay3 pull-right">2</span>
									</a>
								</li>			  
								<li>
									<a href="#" class="sidebarRight-toggle">
										Message
										<span class="badge badge-success bounceIn animation-delay4 pull-right">7</span>
									</a>
								</li>			  	  
								<li class="divider"></li>
								<li>
									<a href="#">Setting</a>
								</li>			  	  
							</ul>
						</div>
						<a href="lockscreen.html" class="pull-right font-18"><i class="ion-log-out"></i></a>
					</div>
				</div><!-- sidebar-inner -->
			</aside>
			
			<div class="main-container">
				<div class="padding-md">
					<ul class="breadcrumb">
						<li><span class="primary-font"><i class="icon-home"></i></span><a href="index.html"> Home</a></li>
						<li>UI Elements</li>	 
						<li>Button</li>	 
					</ul>

					<h2 class="header-text m-bottom-md">
						Button
						<span class="sub-header">
							Sub header Here
						</span>
					</h2>
					<div class="smart-widget widget-green">
						<div class="smart-widget-header">
							Default Button
							<span class="smart-widget-option">
								<span class="refresh-icon-animated">
									<i class="fa fa-circle-o-notch fa-spin"></i>
								</span>
	                            <a href="#" class="widget-toggle-hidden-option">
	                                <i class="fa fa-cog"></i>
	                            </a>
	                            <a href="#" class="widget-collapse-option" data-toggle="collapse">
	                                <i class="fa fa-chevron-up"></i>
	                            </a>
	                            <a href="#" class="widget-refresh-option">
	                                <i class="fa fa-refresh"></i>
	                            </a>
	                            <a href="#" class="widget-remove-option">
	                                <i class="fa fa-times"></i>
	                            </a>
	                        </span>
						</div>
						<div class="smart-widget-inner">
							<div class="smart-widget-hidden-section">
								<ul class="widget-color-list clearfix">
									<li style="background-color:#20232b;" data-color="widget-dark"></li>
									<li style="background-color:#4c5f70;" data-color="widget-dark-blue"></li>
									<li style="background-color:#23b7e5;" data-color="widget-blue"></li>
									<li style="background-color:#2baab1;" data-color="widget-green"></li>
									<li style="background-color:#edbc6c;" data-color="widget-yellow"></li>
									<li style="background-color:#fbc852;" data-color="widget-orange"></li>
									<li style="background-color:#e36159;" data-color="widget-red"></li>
									<li style="background-color:#7266ba;" data-color="widget-purple"></li>
									<li style="background-color:#f5f5f5;" data-color="widget-light-grey"></li>
									<li style="background-color:#fff;" data-color="reset"></li>
								</ul>
							</div>
							<div class="smart-widget-body">
								<button type="submit" class="btn btn-default marginTB-xs">Default</button>
								<button type="submit" class="btn btn-primary marginTB-xs">Primary</button>
								<button type="submit" class="btn btn-info marginTB-xs">Info</button>
								<button type="submit" class="btn btn-success marginTB-xs">Success</button>
								<button type="submit" class="btn btn-warning marginTB-xs">Warning</button>
								<button type="submit" class="btn btn-danger marginTB-xs">Danger</button>
							</div>
						</div><!-- ./smart-widget-inner -->
					</div><!-- ./smart-widget -->
					
					<div class="smart-widget">
						<div class="smart-widget-header">
							Button Dropdown
							<span class="smart-widget-option">
								<span class="refresh-icon-animated">
									<i class="fa fa-circle-o-notch fa-spin"></i>
								</span>
	                            <a href="#" class="widget-toggle-hidden-option">
	                                <i class="fa fa-cog"></i>
	                            </a>
	                            <a href="#" class="widget-collapse-option" data-toggle="collapse">
	                                <i class="fa fa-chevron-up"></i>
	                            </a>
	                            <a href="#" class="widget-refresh-option">
	                                <i class="fa fa-refresh"></i>
	                            </a>
	                            <a href="#" class="widget-remove-option">
	                                <i class="fa fa-times"></i>
	                            </a>
	                        </span>
						</div>
						<div class="smart-widget-inner">
							<div class="smart-widget-hidden-section">
								<ul class="widget-color-list clearfix">
									<li style="background-color:#20232b;" data-color="widget-dark"></li>
									<li style="background-color:#4c5f70;" data-color="widget-dark-blue"></li>
									<li style="background-color:#23b7e5;" data-color="widget-blue"></li>
									<li style="background-color:#2baab1;" data-color="widget-green"></li>
									<li style="background-color:#edbc6c;" data-color="widget-yellow"></li>
									<li style="background-color:#fbc852;" data-color="widget-orange"></li>
									<li style="background-color:#e36159;" data-color="widget-red"></li>
									<li style="background-color:#7266ba;" data-color="widget-purple"></li>
									<li style="background-color:#f5f5f5;" data-color="widget-light-grey"></li>
									<li style="background-color:#fff;" data-color="reset"></li>
								</ul>
							</div>
							<div class="smart-widget-body">
								<div class="btn-group marginTB-xs">
							  		<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
							    		Action <span class="caret"></span>
							  		</button>
							  		<ul class="dropdown-menu" role="menu">
									    <li><a href="#">Action</a></li>
									    <li><a href="#">Another action</a></li>
									    <li><a href="#">Something else here</a></li>
									    <li class="divider"></li>
									    <li><a href="#">Separated link</a></li>
							  		</ul>
								</div>
								<div class="btn-group marginTB-xs">
							  		<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
							    		Action <span class="caret"></span>
							  		</button>
							  		<ul class="dropdown-menu" role="menu">
									    <li><a href="#">Action</a></li>
									    <li><a href="#">Another action</a></li>
									    <li><a href="#">Something else here</a></li>
									    <li class="divider"></li>
									    <li><a href="#">Separated link</a></li>
							  		</ul>
								</div>
								<div class="btn-group marginTB-xs">
							 		<button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown">
							    		Action <span class="caret"></span>
							  		</button>
							  		<ul class="dropdown-menu" role="menu">
									    <li><a href="#">Action</a></li>
									    <li><a href="#">Another action</a></li>
									    <li><a href="#">Something else here</a></li>
									    <li class="divider"></li>
									    <li><a href="#">Separated link</a></li>
							  		</ul>
								</div>
								<div class="btn-group marginTB-xs">
							  		<button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown">
							    		Action <span class="caret"></span>
							  		</button>
							  		<ul class="dropdown-menu" role="menu">
							    		<li><a href="#">Action</a></li>
									    <li><a href="#">Another action</a></li>
									    <li><a href="#">Something else here</a></li>
									    <li class="divider"></li>
									    <li><a href="#">Separated link</a></li>
							  		</ul>
								</div>
								<div class="btn-group marginTB-xs">
							  		<button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown">
							    		Action <span class="caret"></span>
							  		</button>
							  		<ul class="dropdown-menu" role="menu">
							    		<li><a href="#">Action</a></li>
									    <li><a href="#">Another action</a></li>
									    <li><a href="#">Something else here</a></li>
									    <li class="divider"></li>
									    <li><a href="#">Separated link</a></li>
							  		</ul>
								</div>
								<div class="btn-group marginTB-xs">
							  		<button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown">
							    		Action <span class="caret"></span>
							  		</button>
							  		<ul class="dropdown-menu" role="menu">
									    <li><a href="#">Action</a></li>
									    <li><a href="#">Another action</a></li>
									    <li><a href="#">Something else here</a></li>
									    <li class="divider"></li>
									    <li><a href="#">Separated link</a></li>
							  		</ul>
								</div>
							</div>
						</div><!-- ./smart-widget-inner -->
					</div><!-- ./smart-widget -->

					<div class="smart-widget">
						<div class="smart-widget-header">
							Button Dropdown
							<span class="smart-widget-option">
								<span class="refresh-icon-animated">
									<i class="fa fa-circle-o-notch fa-spin"></i>
								</span>
	                            <a href="#" class="widget-toggle-hidden-option">
	                                <i class="fa fa-cog"></i>
	                            </a>
	                            <a href="#" class="widget-collapse-option" data-toggle="collapse">
	                                <i class="fa fa-chevron-up"></i>
	                            </a>
	                            <a href="#" class="widget-refresh-option">
	                                <i class="fa fa-refresh"></i>
	                            </a>
	                            <a href="#" class="widget-remove-option">
	                                <i class="fa fa-times"></i>
	                            </a>
	                        </span>
						</div>
						<div class="smart-widget-inner">
							<div class="smart-widget-hidden-section">
								<ul class="widget-color-list clearfix">
									<li style="background-color:#20232b;" data-color="widget-dark"></li>
									<li style="background-color:#4c5f70;" data-color="widget-dark-blue"></li>
									<li style="background-color:#23b7e5;" data-color="widget-blue"></li>
									<li style="background-color:#2baab1;" data-color="widget-green"></li>
									<li style="background-color:#edbc6c;" data-color="widget-yellow"></li>
									<li style="background-color:#fbc852;" data-color="widget-orange"></li>
									<li style="background-color:#e36159;" data-color="widget-red"></li>
									<li style="background-color:#7266ba;" data-color="widget-purple"></li>
									<li style="background-color:#f5f5f5;" data-color="widget-light-grey"></li>
									<li style="background-color:#fff;" data-color="reset"></li>
								</ul>
							</div>
							<div class="smart-widget-body">
								<div class="btn-group marginTB-xs">
							  		<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
							    		Action <span class="caret"></span>
							  		</button>
							  		<ul class="dropdown-menu" role="menu">
							    		<li><a href="#">Action</a></li>
							    		<li><a href="#">Another action</a></li>
							    		<li><a href="#">Something else here</a></li>
							    		<li class="divider"></li>
							    		<li><a href="#">Separated link</a></li>
							  		</ul>
								</div>
								<div class="btn-group marginTB-xs">
							  		<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
							    		Action <span class="caret"></span>
							  		</button>
							  		<ul class="dropdown-menu" role="menu">
							    		<li><a href="#">Action</a></li>
							    		<li><a href="#">Another action</a></li>
							    		<li><a href="#">Something else here</a></li>
							    		<li class="divider"></li>
							    		<li><a href="#">Separated link</a></li>
							  		</ul>
								</div>
								<div class="btn-group marginTB-xs">
							  		<button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown">
							    		Action <span class="caret"></span>
							  		</button>
							  		<ul class="dropdown-menu" role="menu">
							    		<li><a href="#">Action</a></li>
							    		<li><a href="#">Another action</a></li>
							    		<li><a href="#">Something else here</a></li>
							    		<li class="divider"></li>
							    		<li><a href="#">Separated link</a></li>
							  		</ul>
								</div>
								<div class="btn-group marginTB-xs">
							  		<button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown">
							    		Action <span class="caret"></span>
							  		</button>
							  		<ul class="dropdown-menu" role="menu">
							    		<li><a href="#">Action</a></li>
							    		<li><a href="#">Another action</a></li>
							    		<li><a href="#">Something else here</a></li>
							    		<li class="divider"></li>
							    		<li><a href="#">Separated link</a></li>
							  		</ul>
								</div>
								<div class="btn-group marginTB-xs">
							  		<button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown">
							    		Action <span class="caret"></span>
							  		</button>
							  		<ul class="dropdown-menu" role="menu">
							    		<li><a href="#">Action</a></li>
							    		<li><a href="#">Another action</a></li>
							    		<li><a href="#">Something else here</a></li>
									    <li class="divider"></li>
									    <li><a href="#">Separated link</a></li>
							  		</ul>
								</div>
								<div class="btn-group marginTB-xs">
							  		<button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown">
							    		Action <span class="caret"></span>
							  		</button>
							  		<ul class="dropdown-menu" role="menu">
									    <li><a href="#">Action</a></li>
									    <li><a href="#">Another action</a></li>
									    <li><a href="#">Something else here</a></li>
									    <li class="divider"></li>
									    <li><a href="#">Separated link</a></li>
							  		</ul>
								</div>
							</div>
						</div><!-- ./smart-widget-inner -->
					</div><!-- ./smart-widget -->

					<div class="smart-widget">
						<div class="smart-widget-header">
							Split Button
							<span class="smart-widget-option">
								<span class="refresh-icon-animated">
									<i class="fa fa-circle-o-notch fa-spin"></i>
								</span>
	                            <a href="#" class="widget-toggle-hidden-option">
	                                <i class="fa fa-cog"></i>
	                            </a>
	                            <a href="#" class="widget-collapse-option" data-toggle="collapse">
	                                <i class="fa fa-chevron-up"></i>
	                            </a>
	                            <a href="#" class="widget-refresh-option">
	                                <i class="fa fa-refresh"></i>
	                            </a>
	                            <a href="#" class="widget-remove-option">
	                                <i class="fa fa-times"></i>
	                            </a>
	                        </span>
						</div>
						<div class="smart-widget-inner">
							<div class="smart-widget-hidden-section">
								<ul class="widget-color-list clearfix">
									<li style="background-color:#20232b;" data-color="widget-dark"></li>
									<li style="background-color:#4c5f70;" data-color="widget-dark-blue"></li>
									<li style="background-color:#23b7e5;" data-color="widget-blue"></li>
									<li style="background-color:#2baab1;" data-color="widget-green"></li>
									<li style="background-color:#edbc6c;" data-color="widget-yellow"></li>
									<li style="background-color:#fbc852;" data-color="widget-orange"></li>
									<li style="background-color:#e36159;" data-color="widget-red"></li>
									<li style="background-color:#7266ba;" data-color="widget-purple"></li>
									<li style="background-color:#f5f5f5;" data-color="widget-light-grey"></li>
									<li style="background-color:#fff;" data-color="reset"></li>
								</ul>
							</div>
							<div class="smart-widget-body">
								<div class="btn-group marginTB-xs">
							  		<button type="button" class="btn btn-default">Action</button>
							  		<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
							    		<span class="caret"></span>
							    		<span class="sr-only">Toggle Dropdown</span>
							  		</button>
							  		<ul class="dropdown-menu" role="menu">
									    <li><a href="#">Action</a></li>
									    <li><a href="#">Another action</a></li>
									    <li><a href="#">Something else here</a></li>
									    <li class="divider"></li>
									    <li><a href="#">Separated link</a></li>
							  		</ul>
								</div>
								<div class="btn-group marginTB-xs">
							  		<button type="button" class="btn btn-primary">Action</button>
							 		<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
							    		<span class="caret"></span>
							    		<span class="sr-only">Toggle Dropdown</span>
							  		</button>
							  		<ul class="dropdown-menu" role="menu">
									    <li><a href="#">Action</a></li>
									    <li><a href="#">Another action</a></li>
									    <li><a href="#">Something else here</a></li>
									    <li class="divider"></li>
									    <li><a href="#">Separated link</a></li>
							  		</ul>
								</div>
								<div class="btn-group marginTB-xs">
							  		<button type="button" class="btn btn-info">Action</button>
							  		<button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown">
							    		<span class="caret"></span>
							    		<span class="sr-only">Toggle Dropdown</span>
							  		</button>
							  		<ul class="dropdown-menu" role="menu">
									    <li><a href="#">Action</a></li>
									    <li><a href="#">Another action</a></li>
									    <li><a href="#">Something else here</a></li>
									    <li class="divider"></li>
									    <li><a href="#">Separated link</a></li>
							  		</ul>
								</div>
								<div class="btn-group marginTB-xs">
							  		<button type="button" class="btn btn-success">Action</button>
							  		<button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown">
							    		<span class="caret"></span>
							    		<span class="sr-only">Toggle Dropdown</span>
							  		</button>
							  		<ul class="dropdown-menu" role="menu">
									    <li><a href="#">Action</a></li>
									    <li><a href="#">Another action</a></li>
									    <li><a href="#">Something else here</a></li>
									    <li class="divider"></li>
									    <li><a href="#">Separated link</a></li>
							  		</ul>
								</div>
								<div class="btn-group marginTB-xs">
							  		<button type="button" class="btn btn-warning">Action</button>
							  		<button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown">
							    		<span class="caret"></span>
							    		<span class="sr-only">Toggle Dropdown</span>
							  		</button>
							  		<ul class="dropdown-menu" role="menu">
									    <li><a href="#">Action</a></li>
									    <li><a href="#">Another action</a></li>
									    <li><a href="#">Something else here</a></li>
									    <li class="divider"></li>
									    <li><a href="#">Separated link</a></li>
							  		</ul>
								</div>
								<div class="btn-group marginTB-xs">
							  		<button type="button" class="btn btn-danger">Action</button>
							  		<button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown">
							    		<span class="caret"></span>
							    		<span class="sr-only">Toggle Dropdown</span>
							  		</button>
							  		<ul class="dropdown-menu" role="menu">
							    		<li><a href="#">Action</a></li>
									    <li><a href="#">Another action</a></li>
									    <li><a href="#">Something else here</a></li>
									    <li class="divider"></li>
									    <li><a href="#">Separated link</a></li>
							  		</ul>
								</div>
							</div>
						</div><!-- ./smart-widget-inner -->
					</div><!-- ./smart-widget -->

					<div class="smart-widget">
						<div class="smart-widget-header">
							Button Sizes
							<span class="smart-widget-option">
								<span class="refresh-icon-animated">
									<i class="fa fa-circle-o-notch fa-spin"></i>
								</span>
	                            <a href="#" class="widget-toggle-hidden-option">
	                                <i class="fa fa-cog"></i>
	                            </a>
	                            <a href="#" class="widget-collapse-option" data-toggle="collapse">
	                                <i class="fa fa-chevron-up"></i>
	                            </a>
	                            <a href="#" class="widget-refresh-option">
	                                <i class="fa fa-refresh"></i>
	                            </a>
	                            <a href="#" class="widget-remove-option">
	                                <i class="fa fa-times"></i>
	                            </a>
	                        </span>
						</div>
						<div class="smart-widget-inner">
							<div class="smart-widget-hidden-section">
								<ul class="widget-color-list clearfix">
									<li style="background-color:#20232b;" data-color="widget-dark"></li>
									<li style="background-color:#4c5f70;" data-color="widget-dark-blue"></li>
									<li style="background-color:#23b7e5;" data-color="widget-blue"></li>
									<li style="background-color:#2baab1;" data-color="widget-green"></li>
									<li style="background-color:#edbc6c;" data-color="widget-yellow"></li>
									<li style="background-color:#fbc852;" data-color="widget-orange"></li>
									<li style="background-color:#e36159;" data-color="widget-red"></li>
									<li style="background-color:#7266ba;" data-color="widget-purple"></li>
									<li style="background-color:#f5f5f5;" data-color="widget-light-grey"></li>
									<li style="background-color:#fff;" data-color="reset"></li>
								</ul>
							</div>
							<div class="smart-widget-body">
								<p>
									<button type="button" class="btn btn-info btn-lg">Large button</button>
								  	<button type="button" class="btn btn-default btn-lg">Large button</button>
								</p>
								<p>
								 	<button type="button" class="btn btn-info">Default button</button>
								 	<button type="button" class="btn btn-default">Default button</button>
								</p>
								<p>
								  	<button type="button" class="btn btn-info btn-sm">Small button</button>
								  	<button type="button" class="btn btn-default btn-sm">Small button</button>
								</p>
								<p>
								  	<button type="button" class="btn btn-info btn-xs">Extra small button</button>
								  	<button type="button" class="btn btn-default btn-xs">Extra small button</button>
								</p>
							</div>
						</div><!-- ./smart-widget-inner -->
					</div><!-- ./smart-widget -->

					<div class="smart-widget">
						<div class="smart-widget-header">
							Button Group
							<span class="smart-widget-option">
								<span class="refresh-icon-animated">
									<i class="fa fa-circle-o-notch fa-spin"></i>
								</span>
	                            <a href="#" class="widget-toggle-hidden-option">
	                                <i class="fa fa-cog"></i>
	                            </a>
	                            <a href="#" class="widget-collapse-option" data-toggle="collapse">
	                                <i class="fa fa-chevron-up"></i>
	                            </a>
	                            <a href="#" class="widget-refresh-option">
	                                <i class="fa fa-refresh"></i>
	                            </a>
	                            <a href="#" class="widget-remove-option">
	                                <i class="fa fa-times"></i>
	                            </a>
	                        </span>
						</div>
						<div class="smart-widget-inner">
							<div class="smart-widget-hidden-section">
								<ul class="widget-color-list clearfix">
									<li style="background-color:#20232b;" data-color="widget-dark"></li>
									<li style="background-color:#4c5f70;" data-color="widget-dark-blue"></li>
									<li style="background-color:#23b7e5;" data-color="widget-blue"></li>
									<li style="background-color:#2baab1;" data-color="widget-green"></li>
									<li style="background-color:#edbc6c;" data-color="widget-yellow"></li>
									<li style="background-color:#fbc852;" data-color="widget-orange"></li>
									<li style="background-color:#e36159;" data-color="widget-red"></li>
									<li style="background-color:#7266ba;" data-color="widget-purple"></li>
									<li style="background-color:#f5f5f5;" data-color="widget-light-grey"></li>
									<li style="background-color:#fff;" data-color="reset"></li>
								</ul>
							</div>
							<div class="smart-widget-body">
								<div class="btn-group">
							  		<button type="button" class="btn btn-default">Left</button>
							  		<button type="button" class="btn btn-default">Middle</button>
							  		<button type="button" class="btn btn-default">Right</button>
								</div>
							</div>
						</div><!-- ./smart-widget-inner -->
					</div><!-- ./smart-widget -->

					<div class="smart-widget">
						<div class="smart-widget-header">
							Button Toolbar
							<span class="smart-widget-option">
								<span class="refresh-icon-animated">
									<i class="fa fa-circle-o-notch fa-spin"></i>
								</span>
	                            <a href="#" class="widget-toggle-hidden-option">
	                                <i class="fa fa-cog"></i>
	                            </a>
	                            <a href="#" class="widget-collapse-option" data-toggle="collapse">
	                                <i class="fa fa-chevron-up"></i>
	                            </a>
	                            <a href="#" class="widget-refresh-option">
	                                <i class="fa fa-refresh"></i>
	                            </a>
	                            <a href="#" class="widget-remove-option">
	                                <i class="fa fa-times"></i>
	                            </a>
	                        </span>
						</div>
						<div class="smart-widget-inner">
							<div class="smart-widget-hidden-section">
								<ul class="widget-color-list clearfix">
									<li style="background-color:#20232b;" data-color="widget-dark"></li>
									<li style="background-color:#4c5f70;" data-color="widget-dark-blue"></li>
									<li style="background-color:#23b7e5;" data-color="widget-blue"></li>
									<li style="background-color:#2baab1;" data-color="widget-green"></li>
									<li style="background-color:#edbc6c;" data-color="widget-yellow"></li>
									<li style="background-color:#fbc852;" data-color="widget-orange"></li>
									<li style="background-color:#e36159;" data-color="widget-red"></li>
									<li style="background-color:#7266ba;" data-color="widget-purple"></li>
									<li style="background-color:#f5f5f5;" data-color="widget-light-grey"></li>
									<li style="background-color:#fff;" data-color="reset"></li>
								</ul>
							</div>
							<div class="smart-widget-body">
								<div class="btn-toolbar" role="toolbar">
						      		<div class="btn-group marginTB-xs">
								        <button type="button" class="btn btn-default">1</button>
								        <button type="button" class="btn btn-default">2</button>
								        <button type="button" class="btn btn-default">3</button>
								        <button type="button" class="btn btn-default">4</button>
						      		</div>
						      		<div class="btn-group marginTB-xs">
								        <button type="button" class="btn btn-default">5</button>
								        <button type="button" class="btn btn-default">6</button>
								        <button type="button" class="btn btn-default">7</button>
						      		</div>
						      		<div class="btn-group marginTB-xs">
						        		<button type="button" class="btn btn-default">8</button>
						      		</div>
						    	</div>
							</div>
						</div><!-- ./smart-widget-inner -->
					</div><!-- ./smart-widget -->

					<div class="smart-widget">
						<div class="smart-widget-header">
							Nesting
							<span class="smart-widget-option">
								<span class="refresh-icon-animated">
									<i class="fa fa-circle-o-notch fa-spin"></i>
								</span>
	                            <a href="#" class="widget-toggle-hidden-option">
	                                <i class="fa fa-cog"></i>
	                            </a>
	                            <a href="#" class="widget-collapse-option" data-toggle="collapse">
	                                <i class="fa fa-chevron-up"></i>
	                            </a>
	                            <a href="#" class="widget-refresh-option">
	                                <i class="fa fa-refresh"></i>
	                            </a>
	                            <a href="#" class="widget-remove-option">
	                                <i class="fa fa-times"></i>
	                            </a>
	                        </span>
						</div>
						<div class="smart-widget-inner">
							<div class="smart-widget-hidden-section">
								<ul class="widget-color-list clearfix">
									<li style="background-color:#20232b;" data-color="widget-dark"></li>
									<li style="background-color:#4c5f70;" data-color="widget-dark-blue"></li>
									<li style="background-color:#23b7e5;" data-color="widget-blue"></li>
									<li style="background-color:#2baab1;" data-color="widget-green"></li>
									<li style="background-color:#edbc6c;" data-color="widget-yellow"></li>
									<li style="background-color:#fbc852;" data-color="widget-orange"></li>
									<li style="background-color:#e36159;" data-color="widget-red"></li>
									<li style="background-color:#7266ba;" data-color="widget-purple"></li>
									<li style="background-color:#f5f5f5;" data-color="widget-light-grey"></li>
									<li style="background-color:#fff;" data-color="reset"></li>
								</ul>
							</div>
							<div class="smart-widget-body">
								<div class="btn-group">
									<button type="button" class="btn btn-default">1</button>
									<button type="button" class="btn btn-default">2</button>
							    	<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
							      		Dropdown
							      		<span class="caret"></span>
							    	</button>
							    	<ul class="dropdown-menu">
							      		<li><a href="#">Dropdown link</a></li>
							      		<li><a href="#">Dropdown link</a></li>
							    	</ul>
								</div>
							</div>
						</div><!-- ./smart-widget-inner -->
					</div><!-- ./smart-widget -->

					<div class="smart-widget">
						<div class="smart-widget-header">
							Button with icon
							<span class="smart-widget-option">
								<span class="refresh-icon-animated">
									<i class="fa fa-circle-o-notch fa-spin"></i>
								</span>
	                            <a href="#" class="widget-toggle-hidden-option">
	                                <i class="fa fa-cog"></i>
	                            </a>
	                            <a href="#" class="widget-collapse-option" data-toggle="collapse">
	                                <i class="fa fa-chevron-up"></i>
	                            </a>
	                            <a href="#" class="widget-refresh-option">
	                                <i class="fa fa-refresh"></i>
	                            </a>
	                            <a href="#" class="widget-remove-option">
	                                <i class="fa fa-times"></i>
	                            </a>
	                        </span>
						</div>
						<div class="smart-widget-inner">
							<div class="smart-widget-hidden-section">
								<ul class="widget-color-list clearfix">
									<li style="background-color:#20232b;" data-color="widget-dark"></li>
									<li style="background-color:#4c5f70;" data-color="widget-dark-blue"></li>
									<li style="background-color:#23b7e5;" data-color="widget-blue"></li>
									<li style="background-color:#2baab1;" data-color="widget-green"></li>
									<li style="background-color:#edbc6c;" data-color="widget-yellow"></li>
									<li style="background-color:#fbc852;" data-color="widget-orange"></li>
									<li style="background-color:#e36159;" data-color="widget-red"></li>
									<li style="background-color:#7266ba;" data-color="widget-purple"></li>
									<li style="background-color:#f5f5f5;" data-color="widget-light-grey"></li>
									<li style="background-color:#fff;" data-color="reset"></li>
								</ul>
							</div>
							<div class="smart-widget-body">
								<button type="button" class="btn btn-primary marginTB-xs"><i class="fa fa-save m-right-xs"></i>Save</button>

								<button type="button" class="btn btn-success marginTB-xs">Next<i class="fa fa-angle-double-right m-left-xs"></i></button>

								<button type="button" class="btn btn-default marginTB-xs"><i class="fa fa-spinner fa-spin m-right-xs"></i>Loading</button>
							</div>
						</div><!-- ./smart-widget-inner -->
					</div><!-- ./smart-widget -->

					<h2 class="header-text m-bottom-md">
						Icon
						<span class="sub-header">
							See All Awesome Icons <a href="http://fortawesome.github.io/Font-Awesome/">here</a>
						</span>
					</h2>

					<div class="row example-icon-list">    
						<div class="col-md-3 col-sm-4">
							<div class="example-icon-inner"><i class="fa fa-adjust"></i> fa-adjust</div>
						</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-anchor"></i> fa-anchor</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-archive"></i> fa-archive</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-arrows"></i> fa-arrow</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-arrows-h"></i> fa-arrows-h</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-arrows-v"></i> fa-arrows-v</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-asterisk"></i> fa-asterisk</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-automobile"></i> fa-automobile <span class="text-muted">(alias)</span></div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-ban"></i> fa-ban</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-bank"></i> fa-bank <span class="text-muted">(alias)</span></div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-bar-chart-o"></i> fa-bar-chart-o</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-barcode"></i> fa-barcode</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-bars"></i> fa-bars</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-beer"></i> fa-beer</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-bell"></i> fa-bell</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-bell-o"></i> fa-bell-o</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-bolt"></i> fa-bolt</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-bomb"></i> fa-bomb</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-book"></i> fa-book</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-bookmark"></i> fa-bookmark</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-bookmark-o"></i> fa-bookmark-o</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-briefcase"></i> fa-briefcase</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-bug"></i> fa-bug</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-building"></i> fa-building</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-building-o"></i> fa-building-o</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-bullhorn"></i> fa-bullhorn</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-bullseye"></i> fa-bullseye</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-cab"></i> fa-cab <span class="text-muted">(alias)</span></div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-calendar"></i> fa-calendar</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-calendar-o"></i> fa-calendar-o</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-camera"></i> fa-camera</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-camera-retro"></i> fa-camera-retro</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-car"></i> fa-car</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-caret-square-o-down"></i> fa-caret-square-o-down</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-caret-square-o-left"></i> fa-caret-square-o-left</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-caret-square-o-right"></i> fa-caret-square-o-right</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-caret-square-o-up"></i> fa-caret-square-o-up</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-certificate"></i> fa-certificate</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-check"></i> fa-check</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-check-circle"></i> fa-check-circle</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-check-circle-o"></i> fa-check-circle-o</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-check-square"></i> fa-check-square</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-check-square-o"></i> fa-check-square-o</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-child"></i> fa-child</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-circle"></i> fa-circle</div>
				      	</div>
				      	<div class="col-md-3 col-sm-4">
				      		<div class="example-icon-inner"><i class="fa fa-circle-o"></i> fa-circle-o</div>
				      	</div>
				  	</div><!-- ./example-icon-list -->
				</div><!-- ./padding-md -->
			</div><!-- /main-container -->

			<footer class="footer">
				<span class="footer-brand">
					<strong class="text-danger">Simplify</strong> Admin
				</span>
				<p class="no-margin">
					&copy; 2014 <strong>Simplify Admin</strong>. ALL Rights Reserved. 
				</p>	
			</footer>
		</div><!-- /wrapper -->

		<!-- Delete Widget Confirmation -->
		<div class="custom-popup delete-widget-popup delete-confirmation-popup" id="deleteWidgetConfirm">
			<div class="popup-header text-center">
				<span class="fa-stack fa-4x">
				  <i class="fa fa-circle fa-stack-2x"></i>
				  <i class="fa fa-lock fa-stack-1x fa-inverse"></i>
				</span>
			</div>
			<div class="popup-body text-center">
				<h5>Are you sure to delete this widget?</h5>
				<strong class="block m-top-xs"><i class="fa fa-exclamation-circle m-right-xs text-danger"></i>This action cannot be undone</strong>
			
				<div class="text-center m-top-lg">
					<a class="btn btn-success m-right-sm remove-widget-btn">Delete</a>
					<a class="btn btn-default deleteWidgetConfirm_close">Cancel</a>
				</div>
			</div>
		</div>

		<a href="#" class="scroll-to-top hidden-print"><i class="fa fa-chevron-up fa-lg"></i></a>
		
	    <!-- Le javascript
	    ================================================== -->
	    <!-- Placed at the end of the document so the pages load faster -->
		
		<!-- Jquery -->
		<script src="js/jquery-1.11.1.min.js"></script>
		
		<!-- Bootstrap -->
	    <script src="bootstrap/js/bootstrap.min.js"></script>
		
		<!-- Slimscroll -->
		<script src='js/jquery.slimscroll.min.js'></script>
		
		<!-- Popup Overlay -->
		<script src='js/jquery.popupoverlay.min.js'></script>

		<!-- Modernizr -->
		<script src='js/modernizr.min.js'></script>

		<!-- Simplify -->
		<script src="js/simplify/simplify.js"></script>

		<script>
			$(function()	{
				//Delete Widget Confirmation
				$('#deleteWidgetConfirm').popup({
					vertical: 'top',
					pagecontainer: '.container',
					transition: 'all 0.3s'
				});
			});
		</script>
		
  	</body>
</html>
